<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>div 布局</title>
    <style type="text/css">

        body{
            margin: 0px;
        }
        div#container{
            width: 100%;
            height: 950px;
            background-color: darkgray;
        }
        div#heading{
            width: 100%;
            height:10%;
            background-color: aqua;
        }
        div#content_menu{
            width: 30%;
            height: 80%;
            background-color: aquamarine;
            float: left;
        }
        div#content_body{
            width: 70%;
            height:80%;
            background-color: blueviolet;
            float: left;
        }

        div#footing{
            clear: both;
            width: 100%;
            height:10%;
            background-color: black;
        }

    </style>
</head>
<body>
    <div id="container">
        <div id="heading">头部</div>
        <div id="content_menu">内容菜单</div>
        <div id="content_body">内容主体</div>
        <div id="footing">底部</div>
    </div>
</body>
</html>